<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>星瀚花店</title>
    <link rel="shortcut icon" href="images/img8/花店-百合.png">
    <link rel="stylesheet" href="css/index.css">
    <script src="js/shop.js"></script>
    <script src="js/animate.js"></script>
    <script src="js/shopbanner.js"></script>
    <script src="js/shopitem.js"></script>
</head>

<body>
    <!-- 顶部 -->
    <div class="top">
        <div class="w topheader">
            <!-- 顶部左侧导航栏开始-->
            <div class="topnav">
                <ul>
                    <li><a href="flowers.html" target="_blank">星瀚官网</a></li>
                    <li><a href="index.html">星瀚花城</a></li>
                    <li><a href="https://home.miui.com/" target="_blank">XIHI</a></li>
                    <li><a href="https://iot.mi.com/" target="_blank">IoT</a></li>
                    <li><a href="https://i.mi.com/" target="_blank">云服务</a></li>
                    <li><a href="https://airstar.com/" target="_blank">星瀚数科</a></li>
                    <li><a href="https://www.xiaomiyoupin.com/" target="_blank">有品</a></li>
                    <li><a href="https://xiaoai.mi.com/" target="_blank">星瀚开放平台</a></li>
                    <li><a href="https://qiye.mi.com/" target="_blank">企业团购</a></li>
                    <li><a href="https://www.mi.com/" target="_blank">资质证照</a></li>
                    <li><a href="https://www.mi.com/" target="_blank">协议规则</a></li>
                    <li><a href="https://www.mi.com/" target="_blank">下载app</a></li>
                    <li><a href="javascript:;">Selection&nbsp;Location</a></li>
                </ul>
            </div>
            <!-- 顶部左侧导航栏结束 -->
            <!-- 顶部右侧导航栏开始 -->
            <div class="topnav2">
                <ul>
                    <li><a href="userlogin.html">登录</a></li>
                    <li><a href="userlogin.html">注册</a></li>
                    <li><a href="managerlogin.html">管理员登录</a></li>
                </ul>
            </div>
            <!-- 顶部右侧导航栏结束 -->
            <!-- 购物车 -->
            <div class="shop">
                <ul>
                    <li>
                        <a href="shopping-cart.html" target="_blank">
                            <img src="images/img2/购物车空.png" alt="">
                            购物车&nbsp;(0)
                        </a>
                        <ul>
                            <li>购物车中还没有商品，赶紧选购吧！</li>
                        </ul>
                    </li>
                </ul>
            </div>
            <!-- 购物车结束 -->
        </div>
    </div>
    <!-- 头部 -->
    <div class="headerfather">
        <div class="header w">
            <!-- 小米logo -->
            <div class="logo">
                <img src="images/img8/logo.png" alt="">
            </div>
            <!-- 头部导航栏 -->
            <div class="headernav">
                <ul>
                    <li>
                        <a href="#">星瀚鲜花</a>
                        <ul>
                            <li>
                                <a href="phone.html">
                                    <img src="images/img8/body07.jpg" alt="">
                                    <span>
                                        Xiaomi 13 Ultra 限量定制色
                                    </span>
                                </a>
                            </li>
                            <li>
                                <a href="phone.html">
                                    <img src="images/img8/body08.jpg" alt="">
                                    <span>
                                        Xiaomi 13 Ultra 限量定制色
                                    </span>
                                </a>
                            </li>
                            <li>
                                <a href="phone.html">
                                    <img src="images/img8/body14.jpg" alt="">
                                    <span>
                                        Xiaomi 13 Ultra 限量定制色
                                    </span>
                                </a>
                            </li>
                            <li>
                                <a href="phone.html">
                                    <img src="images/img8/body16.jpg" alt="">
                                    <span>
                                        Xiaomi 13 Ultra 限量定制色
                                    </span>
                                </a>
                            </li>
                            <li>
                                <a href="phone.html">
                                    <img src="images/img8/body18.jpg" alt="">
                                    <span>
                                        Xiaomi 13 Ultra 限量定制色
                                    </span>
                                </a>
                            </li>
                            <li class="lastchild">
                                <a href="phone.html">
                                    <img src="images/img8/body19.jpg" alt="">
                                    <span>
                                        Xiaomi 13 Ultra 限量定制色
                                    </span>
                                </a>
                            </li>
                        </ul>
                    </li>
                    <li>
                        <a href="#">花束</a>
                        <ul>
                            <li>
                                <a href="phone.html">
                                    <img src="images/img8/body20.jpg" alt="">
                                    <span>
                                        Xiaomi 13 Ultra 限量定制色
                                    </span>
                                </a>
                            </li>
                            <li>
                                <a href="phone.html">
                                    <img src="images/img8/body22.jpg" alt="">
                                    <span>
                                        Xiaomi 13 Ultra 限量定制色
                                    </span>
                                </a>
                            </li>
                            <li>
                                <a href="phone.html">
                                    <img src="images/img8/body07.jpg" alt="">
                                    <span>
                                        Xiaomi 13 Ultra 限量定制色
                                    </span>
                                </a>
                            </li>
                            <li>
                                <a href="phone.html">
                                    <img src="images/img8/body08.jpg" alt="">
                                    <span>
                                        Xiaomi 13 Ultra 限量定制色
                                    </span>
                                </a>
                            </li>
                            <li>
                                <a href="phone.html">
                                    <img src="images/img8/body14.jpg" alt="">
                                    <span>
                                        Xiaomi 13 Ultra 限量定制色
                                    </span>
                                </a>
                            </li>
                            <li class="lastchild">
                                <a href="phone.html">
                                    <img src="images/img8/body16.jpg" alt="">
                                    <span>
                                        Xiaomi 13 Ultra 限量定制色
                                    </span>
                                </a>
                            </li>
                        </ul>
                    </li>
                    <li>
                        <a href="#">礼盒</a>
                        <ul>
                            <li>
                                <a href="phone.html">
                                    <img src="images/img8/body14.jpg" alt="">
                                    <span>
                                        Xiaomi 13 Ultra 限量定制色
                                    </span>
                                </a>
                            </li>
                            <li>
                                <a href="phone.html">
                                    <img src="images/img8/body16.jpg" alt="">
                                    <span>
                                        Xiaomi 13 Ultra 限量定制色
                                    </span>
                                </a>
                            </li>
                            <li>
                                <a href="phone.html">
                                    <img src="images/img8/body18.jpg" alt="">
                                    <span>
                                        Xiaomi 13 Ultra 限量定制色
                                    </span>
                                </a>
                            </li>
                            <li>
                                <a href="phone.html">
                                    <img src="images/img8/body19.jpg" alt="">
                                    <span>
                                        Xiaomi 13 Ultra 限量定制色
                                    </span>
                                </a>
                            </li>
                            <li>
                                <a href="phone.html">
                                    <img src="images/img8/body07.jpg" alt="">
                                    <span>
                                        Xiaomi 13 Ultra 限量定制色
                                    </span>
                                </a>
                            </li>
                            <li class="lastchild">
                                <a href="phone.html">
                                    <img src="images/img8/body08.jpg" alt="">
                                    <span>
                                        Xiaomi 13 Ultra 限量定制色
                                    </span>
                                </a>
                            </li>
                        </ul>
                    </li>
                    <li>
                        <a href="#">蛋糕</a>
                        <ul>
                            <li>
                                <a href="phone.html">
                                    <img src="images/img8/body14.jpg" alt="">
                                    <span>
                                        Xiaomi 13 Ultra 限量定制色
                                    </span>
                                </a>
                            </li>
                            <li>
                                <a href="phone.html">
                                    <img src="images/img8/body16.jpg" alt="">
                                    <span>
                                        Xiaomi 13 Ultra 限量定制色
                                    </span>
                                </a>
                            </li>
                            <li>
                                <a href="phone.html">
                                    <img src="images/img8/body18.jpg" alt="">
                                    <span>
                                        Xiaomi 13 Ultra 限量定制色
                                    </span>
                                </a>
                            </li>
                            <li>
                                <a href="phone.html">
                                    <img src="images/img8/body19.jpg" alt="">
                                    <span>
                                        Xiaomi 13 Ultra 限量定制色
                                    </span>
                                </a>
                            </li>
                            <li>
                                <a href="phone.html">
                                    <img src="images/img8/body07.jpg" alt="">
                                    <span>
                                        Xiaomi 13 Ultra 限量定制色
                                    </span>
                                </a>
                            </li>
                            <li class="lastchild">
                                <a href="phone.html">
                                    <img src="images/img8/body08.jpg" alt="">
                                    <span>
                                        Xiaomi 13 Ultra 限量定制色
                                    </span>
                                </a>
                            </li>
                        </ul>
                    </li>
                    <li>
                        <a href="#">花篮</a>
                        <ul>
                            <li>
                                <a href="phone.html">
                                    <img src="images/img8/body14.jpg" alt="">
                                    <span>
                                        Xiaomi 13 Ultra 限量定制色
                                    </span>
                                </a>
                            </li>
                            <li>
                                <a href="phone.html">
                                    <img src="images/img8/body16.jpg" alt="">
                                    <span>
                                        Xiaomi 13 Ultra 限量定制色
                                    </span>
                                </a>
                            </li>
                            <li>
                                <a href="phone.html">
                                    <img src="images/img8/body18.jpg" alt="">
                                    <span>
                                        Xiaomi 13 Ultra 限量定制色
                                    </span>
                                </a>
                            </li>
                            <li>
                                <a href="phone.html">
                                    <img src="images/img8/body19.jpg" alt="">
                                    <span>
                                        Xiaomi 13 Ultra 限量定制色
                                    </span>
                                </a>
                            </li>
                            <li>
                                <a href="phone.html">
                                    <img src="images/img8/body07.jpg" alt="">
                                    <span>
                                        Xiaomi 13 Ultra 限量定制色
                                    </span>
                                </a>
                            </li>
                            <li class="lastchild">
                                <a href="phone.html">
                                    <img src="images/img8/body08.jpg" alt="">
                                    <span>
                                        Xiaomi 13 Ultra 限量定制色
                                    </span>
                                </a>
                            </li>
                        </ul>
                    </li>
                    <li>
                        <a href="#">绿植</a>
                        <ul>
                            <li>
                                <a href="phone.html">
                                    <img src="images/img8/body14.jpg" alt="">
                                    <span>
                                        Xiaomi 13 Ultra 限量定制色
                                    </span>
                                </a>
                            </li>
                            <li>
                                <a href="phone.html">
                                    <img src="images/img8/body16.jpg" alt="">
                                    <span>
                                        Xiaomi 13 Ultra 限量定制色
                                    </span>
                                </a>
                            </li>
                            <li>
                                <a href="phone.html">
                                    <img src="images/img8/body18.jpg" alt="">
                                    <span>
                                        Xiaomi 13 Ultra 限量定制色
                                    </span>
                                </a>
                            </li>
                            <li>
                                <a href="phone.html">
                                    <img src="images/img8/body19.jpg" alt="">
                                    <span>
                                        Xiaomi 13 Ultra 限量定制色
                                    </span>
                                </a>
                            </li>
                            <li>
                                <a href="phone.html">
                                    <img src="images/img8/body07.jpg" alt="">
                                    <span>
                                        Xiaomi 13 Ultra 限量定制色
                                    </span>
                                </a>
                            </li>
                            <li class="lastchild">
                                <a href="phone.html">
                                    <img src="images/img8/body08.jpg" alt="">
                                    <span>
                                        Xiaomi 13 Ultra 限量定制色
                                    </span>
                                </a>
                            </li>
                        </ul>
                    </li>
                    <li>
                        <a href="#">周花</a>
                        <ul>
                            <li>
                                <a href="phone.html">
                                    <img src="images/img8/body14.jpg" alt="">
                                    <span>
                                        Xiaomi 13 Ultra 限量定制色
                                    </span>
                                </a>
                            </li>
                            <li>
                                <a href="phone.html">
                                    <img src="images/img8/body16.jpg" alt="">
                                    <span>
                                        Xiaomi 13 Ultra 限量定制色
                                    </span>
                                </a>
                            </li>
                            <li>
                                <a href="phone.html">
                                    <img src="images/img8/body18.jpg" alt="">
                                    <span>
                                        Xiaomi 13 Ultra 限量定制色
                                    </span>
                                </a>
                            </li>
                            <li>
                                <a href="phone.html">
                                    <img src="images/img8/body19.jpg" alt="">
                                    <span>
                                        Xiaomi 13 Ultra 限量定制色
                                    </span>
                                </a>
                            </li>
                            <li>
                                <a href="phone.html">
                                    <img src="images/img8/body07.jpg" alt="">
                                    <span>
                                        Xiaomi 13 Ultra 限量定制色
                                    </span>
                                </a>
                            </li>
                            <li class="lastchild">
                                <a href="phone.html">
                                    <img src="images/img8/body08.jpg" alt="">
                                    <span>
                                        Xiaomi 13 Ultra 限量定制色
                                    </span>
                                </a>
                            </li>
                        </ul>
                    </li>
                    <li>
                        <a href="https://www.mi.com/" target="_blank">服务中心</a>
                    </li>
                    <li>
                        <a href="javascript:;">社区</a>
                    </li>
            </div>
            <!-- 头部右侧搜索框 -->
            <div class="search">
                <!-- <input type="text" value="输入关键字">
            <button>
            </button> -->
                <div class="icon"></div>
                <div class="textInput">
                    <input type="text" placeholder="search something here...">
                    <input type="submit" value="go" id="go">
                    <div class="clear"></div>
                </div>
            </div>
            <script>
                let $ = tName => {
                    return document.querySelector(tName);
                }
                let oSearch = $('.search');
                let oIcon = $('.icon');
                let oClear = $('.clear');
                let oText = $('input[type="text"]');
                // 绑定事件
                // 收缩
                oIcon.addEventListener('mouseenter', () => {
                    oSearch.classList.toggle('changeWidth');
                })
                // 清空内容
                oClear.addEventListener('click', () => {
                    oText.value = '';
                })
            </script>
        </div>
    </div>

    <!-- banner部分 -->
    <div class="banner">
        <div class="w father">
            <!-- 选项卡列表 -->
            <div class="subnav">
                <ul>
                    <li><a href="phone.html" target="_blank">鲜花<span>&gt;</span></a></li>
                    <li><a href="javascript:;" target="_blank">花束<span>&gt;</span></a></li>
                    <li><a href="javascript:;" target="_blank">礼盒<span>&gt;</span></a></li>
                    <li><a href="javascript:;" target="_blank">蛋糕&nbsp;花篮<span>&gt;</span></a></li>
                    <li><a href="javascript:;" target="_blank">绿植&nbsp;周花<span>&gt;</span></a></li>
                    <li><a href="javascript:;" target="_blank">鲜花&nbsp;礼盒<span>&gt;</span></a></li>
                    <li><a href="javascript:;" target="_blank">友情&nbsp;鲜花<span>&gt;</span></a></li>
                    <li><a href="javascript:;" target="_blank">爱情&nbsp;鲜花<span>&gt;</span></a></li>
                    <li><a href="javascript:;" target="_blank">星瀚&nbsp;仙花<span>&gt;</span></a></li>
                </ul>
            </div>


            <!-- 选项卡内容 -->
            <div class="subcon">
                <div class="item" style="display: none;">
                    <ul>
                        <li><a href="phone.html"><img src="images/img8/body14.jpg" alt=""><span>Xiaomi
                                    MIX系列</span></a>
                        </li>
                        <li><a href="phone.html"><img src="images/img8/body16.jpg" alt=""><span>Xiaomi
                                    数字系列</span></a>
                        </li>
                        <li><a href="phone.html"><img src="images/img8/body18.jpg" alt=""><span>Xiaomi
                                    Civi系列</span></a>
                        </li>
                        <li><a href="phone.html"><img src="images/img8/body19.jpg" alt=""><span>Xiaomi
                                    青春系列</span></a>
                        </li>
                        <li><a href="phone.html"><img src="images/img8/body20.jpg" alt=""><span>Xiaomi
                                    Note系列</span></a>
                        </li>
                    </ul>
                </div>
                <div class="item" style="display: none;">
                    <ul class="w1">
                        <li><a href="phone.html"><img src="images/img8/body14.jpg" alt=""><span>小米电视 MIX系列</span></a>
                        </li>
                        <li><a href="phone.html"><img src="images/img8/body16.jpg" alt=""><span>小米电视
                                    Civi系列</span></a>
                        </li>
                        <li><a href="phone.html"><img src="images/img8/body18.jpg" alt=""><span>小米电视 MIX系列</span></a>
                        </li>
                        <li><a href="phone.html"><img src="images/img8/body19.jpg" alt=""><span>小米电视
                                    Civi系列</span></a>
                        </li>
                        <li><a href="phone.html"><img src="images/img8/body20.jpg" alt=""><span>小米电视 MIX系列</span></a>
                        </li>
                        <li><a href="phone.html"><img src="images/img8/body22.jpg" alt=""><span>小米电视 青春系列</span></a>
                        </li>
                        <li><a href="phone.html"><img src="images/img8/body14.jpg" alt=""><span>小米电视 青春系列</span></a>
                        </li>
                        <li><a href="phone.html"><img src="images/img8/body16.jpg" alt=""><span>小米电视 MIX系列</span></a>
                        </li>
                    </ul>
                </div>
                <div class="item" style="display: none;">
                    <ul class="w2">
                        <li><a href="phone.html"><img src="images/img8/body14.jpg" alt=""><span>Xiaomi
                                    MIX系列</span></a>
                        </li>
                        <li><a href="phone.html"><img src="images/img8/body16.jpg" alt=""><span>Xiaomi
                                    MIX系列</span></a>
                        </li>
                        <li><a href="phone.html"><img src="images/img8/body18.jpg" alt=""><span>Xiaomi
                                    MIX系列</span></a>
                        </li>
                        <li><a href="phone.html"><img src="images/img8/body19.jpg" alt=""><span>Xiaomi
                                    MIX系列</span></a>
                        </li>
                        <li><a href="phone.html"><img src="images/img8/body20.jpg" alt=""><span>Xiaomi
                                    MIX系列</span></a>
                        </li>
                        <li><a href="phone.html"><img src="images/img8/body22.jpg" alt=""><span>Xiaomi
                                    MIX系列</span></a>
                        </li>
                        <li><a href="phone.html"><img src="images/img8/body14.jpg" alt=""><span>Xiaomi
                                    MIX系列</span></a>
                        </li>
                        <li><a href="phone.html"><img src="images/img8/body16.jpg" alt=""><span>Xiaomi
                                    MIX系列</span></a>
                        </li>
                        <li><a href="phone.html"><img src="images/img8/body18.jpg" alt=""><span>Xiaomi
                                    MIX系列</span></a>
                        </li>
                        <li><a href="phone.html"><img src="images/img8/body19.jpg" alt=""><span>Xiaomi
                                    MIX系列</span></a>
                        </li>
                        <li><a href="phone.html"><img src="images/img8/body20.jpg" alt=""><span>Xiaomi
                                    MIX系列</span></a>
                        </li>
                    </ul>
                </div>
                <div class="item" style="display: none;">
                    <ul class="w3">
                        <li><a href="phone.html"><img src="images/img8/body14.jpg" alt=""><span>Xiaomi
                                    MIX系列</span></a>
                        </li>
                        <li><a href="phone.html"><img src="images/img8/body16.jpg" alt=""><span>Xiaomi
                                    MIX系列</span></a>
                        </li>
                        <li><a href="phone.html"><img src="images/img8/body18.jpg" alt=""><span>Xiaomi
                                    MIX系列</span></a>
                        </li>
                        <li><a href="phone.html"><img src="images/img8/body19.jpg" alt=""><span>Xiaomi
                                    MIX系列</span></a>
                        </li>
                        <li><a href="phone.html"><img src="images/img8/body20.jpg" alt=""><span>Xiaomi
                                    MIX系列</span></a>
                        </li>
                        <li><a href="phone.html"><img src="images/img8/body22.jpg" alt=""><span>Xiaomi
                                    MIX系列</span></a>
                        </li>
                        <li><a href="phone.html"><img src="images/img8/body19.jpg" alt=""><span>Xiaomi
                                    MIX系列</span></a>
                        </li>
                        <li><a href="phone.html"><img src="images/img8/body19.jpg" alt=""><span>Xiaomi
                                    MIX系列</span></a>
                        </li>
                        <li><a href="phone.html"><img src="images/img8/body14.jpg" alt=""><span>Xiaomi
                                    MIX系列</span></a>
                        </li>
                        <li><a href="phone.html"><img src="images/img8/body16.jpg" alt=""><span>Xiaomi
                                    MIX系列</span></a>
                        </li>
                        <li><a href="phone.html"><img src="images/img8/body18.jpg" alt=""><span>Xiaomi
                                    MIX系列</span></a>
                        </li>
                        <li><a href="phone.html"><img src="images/img8/body19.jpg" alt=""><span>Xiaomi
                                    MIX系列</span></a>
                        </li>
                        <li><a href="phone.html"><img src="images/img8/body20.jpg" alt=""><span>Xiaomi
                                    MIX系列</span></a>
                        </li>
                        <li><a href="phone.html"><img src="images/img8/body14.jpg" alt=""><span>Xiaomi
                                    MIX系列</span></a>
                        </li>
                        <li><a href="phone.html"><img src="images/img8/body16.jpg" alt=""><span>Xiaomi
                                    MIX系列</span></a>
                        </li>
                        <li><a href="phone.html"><img src="images/img8/body18.jpg" alt=""><span>Xiaomi
                                    MIX系列</span></a>
                        </li>
                        <li><a href="phone.html"><img src="images/img8/body19.jpg" alt=""><span>Xiaomi
                                    MIX系列</span></a>
                        </li>
                        <li><a href="phone.html"><img src="images/img8/body20.jpg" alt=""><span>Xiaomi
                                    MIX系列</span></a>
                        </li>
                    </ul>
                </div>
                <div class="item" style="display: none;">
                    <ul>
                        <li><a href="phone.html"><img src="images/img8/body14.jpg" alt=""><span>小米手环 MIX系列</span></a>
                        </li>
                        <li><a href="phone.html"><img src="images/img8/body16.jpg" alt=""><span>小米手环 MIX系列</span></a>
                        </li>
                        <li><a href="phone.html"><img src="images/img8/body18.jpg" alt=""><span>小米手环 MIX系列</span></a>
                        </li>
                        <li><a href="phone.html"><img src="images/img8/body19.jpg" alt=""><span>小米手环 MIX系列</span></a>
                        </li>
                    </ul>
                </div>
                <div class="item" style="display: none;">
                    <ul class="w1">
                        <li><a href="phone.html"><img src="images/img8/body14.jpg" alt=""><span>Xiaomi
                                    MIX系列</span></a>
                        </li>
                        <li><a href="phone.html"><img src="images/img8/body16.jpg" alt=""><span>Xiaomi
                                    MIX系列</span></a>
                        </li>
                        <li><a href="phone.html"><img src="images/img8/body18.jpg" alt=""><span>Xiaomi
                                    MIX系列</span></a>
                        </li>
                        <li><a href="phone.html"><img src="images/img8/body19.jpg" alt=""><span>Xiaomi
                                    MIX系列</span></a>
                        </li>
                        <li><a href="phone.html"><img src="images/img8/body20.jpg" alt=""><span>Xiaomi
                                    MIX系列</span></a>
                        </li>
                        <li><a href="phone.html"><img src="images/img8/body22.jpg" alt=""><span>Xiaomi
                                    MIX系列</span></a>
                        </li>
                        <li><a href="phone.html"><img src="images/img8/body18.jpg" alt=""><span>Xiaomi
                                    MIX系列</span></a>
                        </li>
                        <li><a href="phone.html"><img src="images/img8/body19.jpg" alt=""><span>Xiaomi
                                    MIX系列</span></a>
                        </li>
                        <li><a href="phone.html"><img src="images/img8/body20.jpg" alt=""><span>Xiaomi
                                    MIX系列</span></a>
                        </li>
                        <li><a href="phone.html"><img src="images/img8/body22.jpg" alt=""><span>Xiaomi
                                    MIX系列</span></a>
                        </li>
                    </ul>
                </div>
                <div class="item" style="display: none;">
                    <ul class="w1">
                        <li><a href="phone.html"><img src="images/img8/body18.jpg" alt=""><span>Xiaomi
                                    MIX系列</span></a>
                        </li>
                        <li><a href="phone.html"><img src="images/img8/body19.jpg" alt=""><span>Xiaomi
                                    MIX系列</span></a>
                        </li>
                        <li><a href="phone.html"><img src="images/img8/body20.jpg" alt=""><span>Xiaomi
                                    MIX系列</span></a>
                        </li>
                        <li><a href="phone.html"><img src="images/img8/body22.jpg" alt=""><span>Xiaomi
                                    MIX系列</span></a>
                        </li>
                        <li><a href="phone.html"><img src="images/img8/body18.jpg" alt=""><span>Xiaomi
                                    MIX系列</span></a>
                        </li>
                        <li><a href="phone.html"><img src="images/img8/body19.jpg" alt=""><span>Xiaomi
                                    MIX系列</span></a>
                        </li>
                        <li><a href="phone.html"><img src="images/img8/body20.jpg" alt=""><span>Xiaomi
                                    MIX系列</span></a>
                        </li>
                    </ul>
                </div>
                <div class="item" style="display: none;">
                    <ul class="w2">
                        <li><a href="phone.html"><img src="images/img8/body18.jpg" alt=""><span>Xiaomi
                                    MIX系列</span></a>
                        </li>
                        <li><a href="phone.html"><img src="images/img8/body19.jpg" alt=""><span>Xiaomi
                                    MIX系列</span></a>
                        </li>
                        <li><a href="phone.html"><img src="images/img8/body20.jpg" alt=""><span>Xiaomi
                                    MIX系列</span></a>
                        </li>
                        <li><a href="phone.html"><img src="images/img8/body22.jpg" alt=""><span>Xiaomi
                                    MIX系列</span></a>
                        </li>
                        <li><a href="phone.html"><img src="images/img8/body18.jpg" alt=""><span>Xiaomi
                                    MIX系列</span></a>
                        </li>
                        <li><a href="phone.html"><img src="images/img8/body19.jpg" alt=""><span>Xiaomi
                                    MIX系列</span></a>
                        </li>
                        <li><a href="phone.html"><img src="images/img8/body20.jpg" alt=""><span>Xiaomi
                                    MIX系列</span></a>
                        </li>
                        <li><a href="phone.html"><img src="images/img8/body22.jpg" alt=""><span>Xiaomi
                                    MIX系列</span></a>
                        </li>
                        <li><a href="phone.html"><img src="images/img8/body18.jpg" alt=""><span>Xiaomi
                                    MIX系列</span></a>
                        </li>
                        <li><a href="phone.html"><img src="images/img8/body19.jpg" alt=""><span>Xiaomi
                                    MIX系列</span></a>
                        </li>
                        <li><a href="phone.html"><img src="images/img8/body20.jpg" alt=""><span>Xiaomi
                                    MIX系列</span></a>
                        </li>
                    </ul>
                </div>
                <div class="item" style="display: none;">
                    <ul>
                        <li><a href="phone.html"><img src="images/img8/body20.jpg" alt=""><span>Xiaomi
                                    MIX系列</span></a>
                        </li>
                        <li><a href="phone.html"><img src="images/img8/body22.jpg" alt=""><span>Xiaomi
                                    MIX系列</span></a>
                        </li>
                    </ul>
                </div>
            </div>


            <!-- 轮播图部分 -->
            <div class="focus">
                <!-- 图片滚动区域 -->
                <ul>
                    <li><a href="phone.html"><img src="images/img8/focus1.jpg" alt=""></a></li>
                    <li><a href="phone.html"><img src="images/img8/focus2.jpg" alt=""></a></li>
                    <li><a href="phone.html"><img src="images/img8/focus3.jpg" alt=""></a></li>
                    <li><a href="phone.html"><img src="images/img8/focus4.jpg" alt=""></a></li>
                    <li><a href="phone.html"><img src="images/img8/focus5.jpeg" alt=""></a></li>
                    <li><a href="phone.html"><img src="images/img8/focus6.jpg" alt=""></a></li>
                    <!-- <li><a href="phone.html"><img src="images/img/bigimg04.webp" alt=""></a></li>
                    <li><a href="phone.html"><img src="images/img/bigimg05.jpg" alt=""></a></li>
                    <li><a href="phone.html"><img src="images/img/bigimg06.webp" alt=""></a></li>
                    <li><a href="phone.html"><img src="images/img/bigimg01.webp" alt=""></a></li>
                    <li><a href="phone.html"><img src="images/img/bigimg02.webp" alt=""></a></li>
                    <li><a href="phone.html"><img src="images/img/bigimg03.jpg" alt=""></a></li> -->
                </ul>
                <!-- 左右箭头 -->
                <div class="prev">
                    <span>&lt;</span>
                </div>
                <div class="next">
                    <span>&gt;</span>
                </div>
                <!-- 小圆圈 -->
                <ol class="circle">
                </ol>
            </div>
        </div>
    </div>


    <!-- 手机 -->
    <div class="title w">爱情鲜花</div>
    <div class="box w main">
        <div class="left">
            <a href="phone.html" target="_blank">
                <img src="images/img8/body1.jpg" alt="">
            </a>
        </div>
        <div class="right">
            <div>
                <a href="phone.html" target="_blank">
                    <img src="images/img8/body01.jpg" alt="">
                </a>
                <p class="review">念念不忘</p>
                <div class="appraise">原生美肌人像｜奇迹阳光动人新色｜骁龙7</div>
                <div class="info">2299元起</div>
            </div>
            <div>
                <a href="phone.html" target="_blank">
                    <img src="images/img8/body02.jpg" alt="">
                </a>
                <p class="review">特别的你</p>
                <div class="appraise">原生美肌人像｜奇迹阳光动人新色｜骁龙7</div>
                <div class="info">2299元起</div>
            </div>
            <div>
                <a href="phone.html" target="_blank">
                    <img src="images/img8/body03.jpg" alt="">
                </a>
                <p class="review">此情不渝</p>
                <div class="appraise">原生美肌人像｜奇迹阳光动人新色｜骁龙7</div>
                <div class="info">2299元起</div>
            </div>
            <div>
                <a href="phone.html" target="_blank">
                    <img src="images/img8/body04.jpg" alt="">
                </a>
                <p class="review">爱的诺言</p>
                <div class="appraise">原生美肌人像｜奇迹阳光动人新色｜骁龙7</div>
                <div class="info">2299元起</div>
            </div>
            <div>
                <a href="phone.html" target="_blank">
                    <img src="images/img8/body05.jpg" alt="">
                </a>
                <p class="review">纯纯的爱</p>
                <div class="appraise">原生美肌人像｜奇迹阳光动人新色｜骁龙7</div>
                <div class="info">2299元起</div>
            </div>
            <div>
                <a href="phone.html" target="_blank">
                    <img src="images/img8/body06.jpg" alt="">
                </a>
                <p class="review">爱你久久</p>
                <div class="appraise">原生美肌人像｜奇迹阳光动人新色｜骁龙7</div>
                <div class="info">2299元起</div>
            </div>
            <div>
                <a href="phone.html" target="_blank">
                    <img src="images/img8/body07.jpg" alt="">
                </a>
                <p class="review">告白气球</p>
                <div class="appraise">原生美肌人像｜奇迹阳光动人新色｜骁龙7</div>
                <div class="info">2299元起</div>
            </div>
            <div>
                <a href="phone.html" target="_blank">
                    <img src="images/img8/body08.jpg" alt="">
                </a>
                <p class="review">可爱兔兔</p>
                <div class="appraise">原生美肌人像｜奇迹阳光动人新色｜骁龙7</div>
                <div class="info">2299元起</div>
            </div>
        </div>
    </div>
    <!-- 智能穿戴 -->
    <div class="title w">友情鲜花</div>
    <div class="box w">
        <div class="left">
            <img src="images/img8/body2.jpg" alt="">
            <!-- <p class="review">Xiaomi Civi 1S</p>
            <div class="appraise">原生美肌人像｜奇迹阳光动人新色｜骁龙7</div>
            <div class="info">2299元起</div> -->
        </div>
        <div class="right">
            <div>
                <img src="images/img8/body09.jpg" alt="">
                <p class="review">蓝色记忆</p>
                <div class="appraise">原生美肌人像｜奇迹阳光动人新色｜骁龙7</div>
                <div class="info">2299元起</div>
            </div>
            <div>
                <img src="images/img8/body10.jpg" alt="">
                <p class="review">蓝色梦想</p>
                <div class="appraise">原生美肌人像｜奇迹阳光动人新色｜骁龙7</div>
                <div class="info">2299元起</div>
            </div>
            <div>
                <img src="images/img8/body11.jpg" alt="">
                <p class="review">蓝色星辰</p>
                <div class="appraise">原生美肌人像｜奇迹阳光动人新色｜骁龙7</div>
                <div class="info">2299元起</div>
            </div>
            <div>
                <img src="images/img8/body12.jpg" alt="">
                <p class="review">美好如初</p>
                <div class="appraise">原生美肌人像｜奇迹阳光动人新色｜骁龙7</div>
                <div class="info">2299元起</div>
            </div>
            <div>
                <img src="images/img8/body13.jpg" alt="">
                <p class="review">美丽星辰</p>
                <div class="appraise">原生美肌人像｜奇迹阳光动人新色｜骁龙7</div>
                <div class="info">2299元起</div>
            </div>
            <div>
                <img src="images/img8/body14.jpg" alt="">
                <p class="review">永恒之心</p>
                <div class="appraise">原生美肌人像｜奇迹阳光动人新色｜骁龙7</div>
                <div class="info">2299元起</div>
            </div>
            <div>
                <img src="images/img8/body15.jpg" alt="">
                <p class="review">专属宠爱</p>
                <div class="appraise">原生美肌人像｜奇迹阳光动人新色｜骁龙7</div>
                <div class="info">2299元起</div>
            </div>
            <div>
                <img src="images/img8/body16.jpg" alt="">
                <p class="review">为你心动</p>
                <div class="appraise">原生美肌人像｜奇迹阳光动人新色｜骁龙7</div>
                <div class="info">2299元起</div>
            </div>
        </div>
    </div>
    <!-- 笔记本 平板 -->
    <div class="title w">鲜花礼盒</div>
    <div class="box w">
        <div class="left">
            <img src="images/img8/body3.jpg" alt="">
            <!-- <p class="review">Xiaomi Civi 1S</p>
            <div class="appraise">原生美肌人像｜奇迹阳光动人新色｜骁龙7</div>
            <div class="info">2299元起</div> -->
        </div>
        <div class="right">
            <div>
                <img src="images/img8/body17.jpg" alt="">
                <p class="review">满天繁星</p>
                <div class="appraise">原生美肌人像｜奇迹阳光动人新色｜骁龙7</div>
                <div class="info">2299元起</div>
            </div>
            <div>
                <img src="images/img8/body18.jpg" alt="">
                <p class="review">情定今生</p>
                <div class="appraise">原生美肌人像｜奇迹阳光动人新色｜骁龙7</div>
                <div class="info">2299元起</div>
            </div>
            <div>
                <img src="images/img8/body19.jpg" alt="">
                <p class="review">挚爱一生</p>
                <div class="appraise">原生美肌人像｜奇迹阳光动人新色｜骁龙7</div>
                <div class="info">2299元起</div>
            </div>
            <div>
                <img src="images/img8/body20.jpg" alt="">
                <p class="review">温暖阳光</p>
                <div class="appraise">原生美肌人像｜奇迹阳光动人新色｜骁龙7</div>
                <div class="info">2299元起</div>
            </div>
            <div>
                <img src="images/img8/body21.jpg" alt="">
                <p class="review">感恩的心</p>
                <div class="appraise">原生美肌人像｜奇迹阳光动人新色｜骁龙7</div>
                <div class="info">2299元起</div>
            </div>
            <div>
                <img src="images/img8/body22.jpg" alt="">
                <p class="review">恋恋情深</p>
                <div class="appraise">原生美肌人像｜奇迹阳光动人新色｜骁龙7</div>
                <div class="info">2299元起</div>
            </div>
            <div>
                <img src="images/img8/body23.jpg" alt="">
                <p class="review">我的女王</p>
                <div class="appraise">原生美肌人像｜奇迹阳光动人新色｜骁龙7</div>
                <div class="info">2299元起</div>
            </div>
            <div>
                <img src="images/img8/body24.jpg" alt="">
                <p class="review">你是唯一</p>
                <div class="appraise">原生美肌人像｜奇迹阳光动人新色｜骁龙7</div>
                <div class="info">2299元起</div>
            </div>
        </div>
    </div>

    <!-- 笔记本 平板 -->
    <div class="title w">蛋糕</div>
    <div class="box w">
        <div class="left">
            <img src="images/img8/banner1.jpg" alt="">
            <!-- <p class="review">Xiaomi Civi 1S</p>
            <div class="appraise">原生美肌人像｜奇迹阳光动人新色｜骁龙7</div>
            <div class="info">2299元起</div> -->
        </div>
        <div class="right">
            <div>
                <img src="images/img8/banner01.jpg" alt="">
                <p class="review">满天繁星</p>
                <div class="appraise">原生美肌人像｜奇迹阳光动人新色｜骁龙7</div>
                <div class="info">2299元起</div>
            </div>
            <div>
                <img src="images/img8/banner02.jpg" alt="">
                <p class="review">情定今生</p>
                <div class="appraise">原生美肌人像｜奇迹阳光动人新色｜骁龙7</div>
                <div class="info">2299元起</div>
            </div>
            <div>
                <img src="images/img8/banner03.jpg" alt="">
                <p class="review">挚爱一生</p>
                <div class="appraise">原生美肌人像｜奇迹阳光动人新色｜骁龙7</div>
                <div class="info">2299元起</div>
            </div>
            <div>
                <img src="images/img8/banner04.jpg" alt="">
                <p class="review">温暖阳光</p>
                <div class="appraise">原生美肌人像｜奇迹阳光动人新色｜骁龙7</div>
                <div class="info">2299元起</div>
            </div>
            <div>
                <img src="images/img8/banner05.jpg" alt="">
                <p class="review">感恩的心</p>
                <div class="appraise">原生美肌人像｜奇迹阳光动人新色｜骁龙7</div>
                <div class="info">2299元起</div>
            </div>
            <div>
                <img src="images/img8/banner06.jpg" alt="">
                <p class="review">恋恋情深</p>
                <div class="appraise">原生美肌人像｜奇迹阳光动人新色｜骁龙7</div>
                <div class="info">2299元起</div>
            </div>
            <div>
                <img src="images/img8/banner07.jpg" alt="">
                <p class="review">我的女王</p>
                <div class="appraise">原生美肌人像｜奇迹阳光动人新色｜骁龙7</div>
                <div class="info">2299元起</div>
            </div>
            <div>
                <img src="images/img8/banner08.jpg" alt="">
                <p class="review">你是唯一</p>
                <div class="appraise">原生美肌人像｜奇迹阳光动人新色｜骁龙7</div>
                <div class="info">2299元起</div>
            </div>
        </div>
    </div>

    <!-- 笔记本 平板 -->
    <div class="title w">开业花篮</div>
    <div class="box w">
        <div class="left">
            <img src="images/img8/banner2.jpg" alt="">
            <!-- <p class="review">Xiaomi Civi 1S</p>
            <div class="appraise">原生美肌人像｜奇迹阳光动人新色｜骁龙7</div>
            <div class="info">2299元起</div> -->
        </div>
        <div class="right">
            <div>
                <img src="images/img8/banner09.jpg" alt="">
                <p class="review">满天繁星</p>
                <div class="appraise">原生美肌人像｜奇迹阳光动人新色｜骁龙7</div>
                <div class="info">2299元起</div>
            </div>
            <div>
                <img src="images/img8/banner10.jpg" alt="">
                <p class="review">情定今生</p>
                <div class="appraise">原生美肌人像｜奇迹阳光动人新色｜骁龙7</div>
                <div class="info">2299元起</div>
            </div>
            <div>
                <img src="images/img8/banner11.jpg" alt="">
                <p class="review">挚爱一生</p>
                <div class="appraise">原生美肌人像｜奇迹阳光动人新色｜骁龙7</div>
                <div class="info">2299元起</div>
            </div>
            <div>
                <img src="images/img8/banner12.jpg" alt="">
                <p class="review">温暖阳光</p>
                <div class="appraise">原生美肌人像｜奇迹阳光动人新色｜骁龙7</div>
                <div class="info">2299元起</div>
            </div>
            <div>
                <img src="images/img8/banner13.jpg" alt="">
                <p class="review">感恩的心</p>
                <div class="appraise">原生美肌人像｜奇迹阳光动人新色｜骁龙7</div>
                <div class="info">2299元起</div>
            </div>
            <div>
                <img src="images/img8/banner14.jpg" alt="">
                <p class="review">恋恋情深</p>
                <div class="appraise">原生美肌人像｜奇迹阳光动人新色｜骁龙7</div>
                <div class="info">2299元起</div>
            </div>
            <div>
                <img src="images/img8/banner15.jpg" alt="">
                <p class="review">我的女王</p>
                <div class="appraise">原生美肌人像｜奇迹阳光动人新色｜骁龙7</div>
                <div class="info">2299元起</div>
            </div>
            <div>
                <img src="images/img8/banner16.jpg" alt="">
                <p class="review">你是唯一</p>
                <div class="appraise">原生美肌人像｜奇迹阳光动人新色｜骁龙7</div>
                <div class="info">2299元起</div>
            </div>
        </div>
    </div>

    <!-- 笔记本 平板 -->
    <div class="title w">绿植</div>
    <div class="box w">
        <div class="left">
            <img src="images/img8/banner3.jpg" alt="">
            <!-- <p class="review">Xiaomi Civi 1S</p>
            <div class="appraise">原生美肌人像｜奇迹阳光动人新色｜骁龙7</div>
            <div class="info">2299元起</div> -->
        </div>
        <div class="right">
            <div>
                <img src="images/img8/banner17.jpg" alt="">
                <p class="review">满天繁星</p>
                <div class="appraise">原生美肌人像｜奇迹阳光动人新色｜骁龙7</div>
                <div class="info">2299元起</div>
            </div>
            <div>
                <img src="images/img8/banner18.jpg" alt="">
                <p class="review">情定今生</p>
                <div class="appraise">原生美肌人像｜奇迹阳光动人新色｜骁龙7</div>
                <div class="info">2299元起</div>
            </div>
            <div>
                <img src="images/img8/banner19.jpg" alt="">
                <p class="review">挚爱一生</p>
                <div class="appraise">原生美肌人像｜奇迹阳光动人新色｜骁龙7</div>
                <div class="info">2299元起</div>
            </div>
            <div>
                <img src="images/img8/banner20.jpg" alt="">
                <p class="review">温暖阳光</p>
                <div class="appraise">原生美肌人像｜奇迹阳光动人新色｜骁龙7</div>
                <div class="info">2299元起</div>
            </div>
            <div>
                <img src="images/img8/banner21.jpg" alt="">
                <p class="review">感恩的心</p>
                <div class="appraise">原生美肌人像｜奇迹阳光动人新色｜骁龙7</div>
                <div class="info">2299元起</div>
            </div>
            <div>
                <img src="images/img8/banner22.jpg" alt="">
                <p class="review">恋恋情深</p>
                <div class="appraise">原生美肌人像｜奇迹阳光动人新色｜骁龙7</div>
                <div class="info">2299元起</div>
            </div>
            <div>
                <img src="images/img8/banner23.jpg" alt="">
                <p class="review">我的女王</p>
                <div class="appraise">原生美肌人像｜奇迹阳光动人新色｜骁龙7</div>
                <div class="info">2299元起</div>
            </div>
            <div>
                <img src="images/img8/banner24.jpg" alt="">
                <p class="review">你是唯一</p>
                <div class="appraise">原生美肌人像｜奇迹阳光动人新色｜骁龙7</div>
                <div class="info">2299元起</div>
            </div>
        </div>
    </div>
    <!-- 底部 -->

    <!-- /尾部 -->
    <!-- <div class="bottom">
        <img src="images/img2/bottom.jpg" alt="">
    </div> -->
    <footer>
        <div class="bottom">
            <div class="footer-service w">
                <ul>
                    <li><a href="javascript:;">预约维修服务</a></li>
                    <li><a href="javascript:;">7天无理由退货</a></li>
                    <li><a href="javascript:;">15天免费换货</a></li>
                    <li><a href="javascript:;">满69元包邮</a></li>
                    <li><a href="javascript:;">1100余家售后网点</a></li>
                </ul>
            </div>
            <div class="footer-links w">
                <dl>
                    <dt>选购指南</dt>
                    <dd><a href="javascript:;">鲜花</a></dd>
                    <dd><a href="javascript:;">花束</a></dd>
                    <dd><a href="javascript:;">绿植</a></dd>
                    <dd><a href="javascript:;">礼盒</a></dd>
                    <dd><a href="javascript:;">仙女</a></dd>
                </dl>
                <dl>
                    <dt>服务中心</dt>
                    <dd><a href="javascript:;">申请售后</a></dd>
                    <dd><a href="javascript:;">售后政策</a></dd>
                    <dd><a href="javascript:;">订单查询</a></dd>
                    <dd><a href="javascript:;">保障服务</a></dd>
                    <dd><a href="javascript:;">防伪查询</a></dd>
                </dl>
                <dl>
                    <dt>线下门店</dt>
                    <dd><a href="javascript:;">服务网点</a></dd>
                    <dd><a href="javascript:;">授权体验店</a></dd>
                    <dd><a href="javascript:;">专区</a></dd>
                    <dd><a href="javascript:;">河北分店</a></dd>
                    <dd><a href="javascript:;">北京总部</a></dd>
                </dl>
                <dl>
                    <dt>关于星瀚</dt>
                    <dd><a href="javascript:;">配送说明</a></dd>
                    <dd><a href="javascript:;">服务条款</a></dd>
                    <dd><a href="javascript:;">订花流程</a></dd>
                    <dd><a href="javascript:;">支付方式</a></dd>
                    <dd><a href="javascript:;">隐私条款</a></dd>
                </dl>
                <dl>
                    <dt>关注我们</dt>
                    <dd><a href="javascript:;">新浪微博</a></dd>
                    <dd><a href="javascript:;">官方微信</a></dd>
                    <dd><a href="javascript:;">联系我们</a></dd>
                    <dd><a href="javascript:;">公益基金会</a></dd>
                    <dd><a href="javascript:;">全国热线：400-060</a></dd>
                </dl>
            </div>
        </div>
        <div class="footer-bottom w">
            <p>
            <div id="one">Copyright©2023&nbsp;河北星瀚科技有限公司&nbsp;</div>
            <div id="two"><a href="javascript:;">冀ICP备20016463号-2</a></div>
            </p>
        </div>
    </footer>
    <!-- 页面固定定位 -->
    <div class="house">
        <div class="ad1 ad">
            <div class="img">
                <img src="images/img7/serve1.png" alt="" class="before">
                <img src="images/img7/serve01.png" alt="" style="display: none;" class="after">
            </div>
            <p class="f">手机app</p>
        </div>
        <div class="ad2 ad">
            <div class="img">
                <img src="images/img7/serve2.png" alt="" class="before">
                <img src="images/img7/serve02.png" alt="" style="display: none;" class="after">
            </div>
            <p class="f">个人中心</p>
        </div>
        <div class="ad3 ad">
            <div class="img">
                <img src="images/img7/serve3.png" alt="" class="before">
                <img src="images/img7/serve03.png" alt="" style="display: none;" class="after">
            </div>
            <p class="f">售后服务</p>
        </div>
        <div class="ad4 ad">
            <div class="img">
                <img src="images/img7/serve4.png" alt="" class="before">
                <img src="images/img7/serve04.png" alt="" style="display: none;" class="after">
            </div>
            <p class="f">人工客服</p>
        </div>
        <div class="ad5 ad">
            <div class="img">
                <img src="images/img7/serve5.png" alt="" class="before">
                <img src="images/img7/serve05.png" alt="" style="display: none;" class="after">
            </div>
            <p class="f">购物车</p>
        </div>
        <div class="ad6 ad goBack" style="display: none;">
            <div class="img">
                <img src="images/img7/totop.png" alt="" class="before">
                <img src="images/img7/totop_hover.png" alt="" style="display: none;" class="after">
            </div>
            <p class="f">返回顶部</p>
        </div>
    </div>
    <script>
        window.addEventListener('load', function () {
            // 防止选中文字
            var house = document.querySelector('.house');
            house.addEventListener('selectstart', function (e) {
                e.preventDefault();
            })
            var ads = document.querySelector('.house').querySelectorAll('.ad');
            var afters = document.querySelector('.house').querySelectorAll('.after');
            var befores = document.querySelector('.house').querySelectorAll('.before');
            for (var i = 0; i < ads.length; i++) {
                ads[i].setAttribute('index', i);
                ads[i].addEventListener('mouseenter', function () {
                    var index = this.getAttribute('index');
                    afters[index].style.display = 'flex';
                    befores[index].style.display = 'none';
                })
                ads[i].addEventListener('mouseleave', function () {
                    var index = this.getAttribute('index');
                    afters[index].style.display = 'none';
                    befores[index].style.display = 'flex';
                })
            }
            // 返回顶部
            var goBack = document.querySelector('.goBack');
            var main = document.querySelector('.main');
            var mainTop = main.offsetTop;
            document.addEventListener('scroll', function () {
                if (window.pageYOffset >= mainTop) {
                    goBack.style.display = 'flex';
                } else {
                    goBack.style.display = 'none';
                }
            })
            // 当我们点击了返回顶部模块，就让窗口滚动到页面最上方
            goBack.addEventListener('click', function () {
                // window.scroll(0, 0);
                animate(window, 0);
            })


            // 动画
            function animate(obj, target, callback) {
                clearInterval(obj.timer);
                obj.timer = setInterval(function () {
                    //步长=（目标位置-当前位置）/10
                    var step = (target - window.pageYOffset) / 10;
                    step = step > 0 ? Math.ceil(step) : Math.floor(step);
                    if (window.pageYOffset == target) {
                        clearInterval(obj.timer);
                        // if (callback) {
                        //     callback();
                        // }
                        callback && callback();
                    }
                    //当前位置+步长
                    // obj.style.left = window.pageYOffset + step + 'px';
                    window.scroll(0, window.pageYOffset + step);
                }, 15);
            }
        })
    </script>
</body>

</html>